<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/static/js/jquery-3.6.0.js"></script>
    <link href="/static/css/register.css" rel="stylesheet"/>
    <link href="/static/bootstrap-4.6.1-dist/css/bootstrap.css" rel="stylesheet">
    <link href="/static/bootstrap-4.6.1-dist/css/bootstrap-reboot.css" rel="stylesheet">
    <link href="/static/bootstrap-4.6.1-dist/css/bootstrap-grid.css" rel="stylesheet">
    <script src="/static/bootstrap-4.6.1-dist/js/bootstrap.bundle.js"></script>
    <script src="/static/bootstrap-4.6.1-dist/js/bootstrap.js"></script>
    <script src="/static/js/jquery.form.js"></script>
</head>
<body>
    <form id="bd" name="bd" action="http://120.24.250.180:1880/api/index.php"  method="post"  enctype="multipart/form-data">
        <input  type="file" name="image" id="image" accept="image/*">
        <input  type="text"  name="wallpaperName" id="wallpaperName">
        <input  type="text"  name="wallpaperUrl" id="wallpaperUrl">
        <input  type="text"  name="wallpaperThumb" id="wallpaperThumb">
        <label>
            <input id="token"  type="text"  name="token"  placeholder="在tokenList文件找到token并输入" value="8337effca0ddfcd9c5899f3509b23657" />
        </label>
        <input  type="button" value="上传图片" id="submit"/>
        <input  type="button" value="进行数据库操作" id="doit"/>
        <input  type="button" value="一键操作" id="doits"/>

    </form>
    <!--http://120.24.250.180:1880/api/index.php-->

    <script>
        $('#image').change(function (){
            console.log($(this)[0].files);
        })
        //表单提交,会把所有有name属性的值提交到后台
        $("#submit").click(function () {
            $("#bd").ajaxSubmit(function (data) {
                console.log(data);
                $('#wallpaperName').val(data.srcName);
                $('#wallpaperUrl').val(data.url);
                $('#wallpaperThumb').val(data.thumb);
            });
        });
        $('#doit').click(function (){
            $.ajax({
                url:'/wallpaper',
                data:JSON.stringify({
                    "wallpaperName":$('#wallpaperName').val(),
                    "wallpaperUrl":$('#wallpaperUrl').val(),
                    "wallpaperThumb":$('#wallpaperThumb').val(),
                }),
                type:'post',
                dataType:'json',
                headers:{
                    Accept:"application/json",
                    "Content-Type":"application/json"
                },
                processData:false,
                cache:false
            }).done(function (data) {

            });
        })
        $('#doits').click(function (){
            $("#bd").ajaxSubmit(function (data) {
                console.log(data);
                $.ajax({
                    url:'/wallpaper',
                    data:JSON.stringify({
                        "wallpaperName":data.srcName,
                        "wallpaperUrl":data.url,
                        "wallpaperThumb":data.thumb,
                    }),
                    type:'post',
                    dataType:'json',
                    headers:{
                        Accept:"application/json",
                        "Content-Type":"application/json"
                    },
                    processData:false,
                    cache:false
                }).done(function (data) {
                    console.log("操作成功");
                });
            });
        })
    </script>
</body>
</html>